<template>
  <div class="lx-desc">
    <div class="title">第三部分 情绪观影</div>
    <div class="sub-title">任务指导语</div>
    <div>
		<p class="content">
			情绪观影测评的目的是了解你的情绪唤醒和叙事能力。接下来会呈现几个的电影片段--它们可能会唤醒你不同的情绪体验。请你在观看完整的视频片段后，对电影情节和您的感受进行描述。
		</p>

		<p class="content">现在，我们开始吧。</p>
	</div>
    <el-button type="primary" @click="next">开始任务</el-button>
  </div>
</template>
<script setup lang="ts">
import useTaskStore from '@/stores/task.js'
const store = useTaskStore()

const next = ()=> {
  store.taskIndex = store.taskIndex+1
}


</script>
<style scoped lang="scss">
.lx-desc{
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 60%;
  margin: 83px auto 0 auto;
  .title{
    font-size: 32px;
    line-height: 44px;
    margin-bottom: 12px;
  }
  .sub-title{
    margin-bottom: 34px;
    line-height: 22px;
  }
  .content{
    //  首行缩进两个字符
    text-indent: 2em;
    font-size: 18px;
	line-height: 28px;

    margin-bottom: 27px;


  }


}
</style>